<template>
    <section class="client-ducoment">
        <!-- <process-statistics/> -->
        <section class="common-block-section">
            <header class="top-line">
                <el-button
                    @click="openDialog(null)"
                    icon="el-icon-plus"
                    type="primary"
                    size="small">
                    新增科目
                </el-button>
            </header>
            <el-table
                :data="subjectList"
                style="width: 100%">
                <el-table-column
                    prop="subjectCode"
                    label="科目代码"
                    min-width="150">
                </el-table-column>
                <el-table-column
                    label="科目"
                    min-width="150">
                <template slot-scope="scope">
                    <span class="tag-serial">{{ scope.row.subjectName }}</span>
                    <el-tag v-if="scope.row.bName != 'common'"> 自定义 </el-tag>
                </template>
                </el-table-column>
            </el-table>
        </section>
        <company-dialog ref="dialog" @modify="loadSubjectList"/>
    </section>
</template>

<script>
/**
 * @file 客户档案
 */
import map from '@/components/map';
// import processStatistics from '@/components/process-statistics';
import dialog from './dialog.vue';

export default {
    components: {
        // processStatistics,
        companyDialog: dialog
    },
    data() {
        return {
            bName:"",
            subjectList:[],
        };
    },
    mounted() {
        this.loadSubjectList();
    },
    methods: {

        /**
         * 打开弹框
         * 
         * @param {Object} companyData 编辑时公司数据，新建时为 null
         */
        openDialog(companyData) {
            this.$refs.dialog.open(companyData);
        },

        batchAdd(){
            this.$router.push({
                name: "batchAddCompanies"
            })
        },
        reloadData(){
            this.$refs.dialog.open();
        },
        /**
         * 翻页触发
         *
         * @param {Number} pageNumber 页码
         */
        loadSubjectList() {
            // 加载科目列表
            const queryData = {
                params:{
                    bName:this.bName
                }
            };
            this.$http.get('/subject/list', queryData).then(res => {
                if (res.code == 0) {
                    this.subjectList = res.data.subjectList;
                } else {
                    this.$message.error("加载科目失败:", res.message);
                }
            });
        },
    }
}
</script>

<style lang="less" scoped>
.client-ducoment {
    padding: 0 10px;
    .top-line {
        padding-bottom: 10px;
        .search-section {
            float: right;
            // width: 60px;
            text-align: right;
            
            .el-input,
            .el-select {
                width: 200px;
                margin-top: 2px;
            }
        }
    }
    .pagination {
        text-align: right;
        padding: 20px 0 0;
    }
}

  .tag-serial {
    margin-right: 10px;
  }

</style>
